<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/allApp.css" />
		<link rel="stylesheet" href="../css/css.css" />
		<style type="text/css">
			body,.mui-content{
				background-color: #FFFFFF;
			}
			.title{
				margin: 0;
			}
			.xj-content .mui-card-content{
				padding: 2px 2px 14px 2px;
			}
			.img-up{
				margin-right:2.6%;
			}
			.fz13{
				font-size: 13px!important;
			}
			.fz15{
				font-size: 15px!important;
			}
			.colorA3A3A3{
				color: #A3A3A3;
			}
			.mui-radio input[type=radio] {
				top: 3px!important;
			}
			.zdycomfirm {
				z-index: 1000000000000000;
				background-color: #FFFFFF;
				display: none;
				width: 80%;
				left: 10%;
				height: 200px;
				position: absolute;
				top: 30%;
				border-radius: 5px;
			}
			
			.zdytitle {
				height: 44px;
				line-height: 44px;
				color: #777777;
				text-align: center;
			}
			
			.zdycnt1 {
				height: 112px;
				padding-left: 12px;
				padding-top: 10px;
				line-height: 25px;
			}
			
			.zdycnt {
				height: 112px;
				padding-left: 12px;
			}
			
			.zdybtn {
				display: flex;
			}
			
			.zdybtn div {
				width: 50%;
				height: 44px;
				line-height: 44px;
				text-align: center;
				color: #007aff;
			
			}
			
			.zdyquit {
				border-right: 1px solid #EFEFF4;
			}
			
			.mui-input-group .mui-input-row:after {
				height: 0px;
			}
			
			.zdyform {
				height: 112px;
				padding-top: 7px;
			}
			
			.zdyradio {
				display: flex;
			}
			
			.zdytt {
				border: 1px solid #c8c7cc !important;
				width: 75%;
				margin-left: 5%;
				height: 60px;
			}
			.hiden,.ifsubmit,.hsyy,.shmsg{
				display: none;
			}
			.outer-border{
				width: 100%;
				padding:15px;
				border-top: 5px solid #eaeaea;
			}
			.common-title{
				border-left: 3px solid #1A5186;
				line-height: 17px;
				padding-left: 4px;
			}
			.p-base-msg{
				display: flex;
				justify-content: space-between;
				margin-top: 6px;
				font-size: 14px;
				padding-left: 12px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title" >现场巡检</h1>
		</header>
		<div class="mui-content hiden" id="container">
			<div class="outer-border ">
				<div class="common-title">
					基本信息
				</div>
				<div class="p-base-msg">
					<span>
						<font class="colorA3A3A3">巡检人:</font>
						<font>{{basemsg.username}}</font>
					</span>
					<span>
						<font class="colorA3A3A3">协助人:</font>
						<font>{{basemsg.helpusernames}}</font>
					</span>
				</div>
				<div class="p-base-msg">
					<span>
						<font class="colorA3A3A3">开始时间:</font>
						<font>{{basemsg.inspect_time}}</font>
					</span>
				</div>
				<div class="p-base-msg">
					<span>
						<font class="colorA3A3A3">结束时间:</font>
						<font>{{basemsg.submit_time}}</font>
					</span>
				</div>
			</div>
			<div class="outer-border">
				<div class="common-title">
					巡检项
				</div>
				<div class="xj-content" id="yulan">
				</div>
			</div>
			
			<div class="outer-border shmsg">
				<div class="common-title">
					审核项
				</div>
				<div class="zdycnt1 fz15">
					<span>
						<font class="colorA3A3A3">审核人:</font>
						<font>{{basemsg.reviewname}}</font>
					</span><br/>
					<span>
						<font class="colorA3A3A3">意见:</font>
						<font>{{basemsg.reject_reason}}</font>
					</span><br/>
					<span>
						<font class="colorA3A3A3">审核时间:</font>
						<font>{{basemsg.review_time}}</font>
					</span>
				</div>
			</div>
			<div class="ifsubmit outer-border">
				<div class="common-title">
					审核项
				</div>
				<div class="zdycnt">
					<form class=" zdyform">
						<div class="zdyradio" style="align-items: center;">
							<div class="fz15">
								意见:
							</div>
							<div  class="zdyradio">
								<div class="mui-input-row mui-radio mui-left">
									<label>通过</label>
									<input name="radio1" type="radio" value="yes">
								</div>
								<div class="mui-input-row mui-radio mui-left">
									<label>不通过</label>
									<input name="radio1" type="radio" value="no">
								</div>
							</div>
						</div>
						<div class="hsyy" >
							<div class="zdyradio fz15">
								<span>原因:</span>
								<textarea class="zdytt"></textarea>
							</div>
						</div>
					</form>
					<div class="btn ">
						<div class="mui-btn mui-btn-primary mui-col-sm-12 mui-col-xs-12" style="background-color: #1A5186;" id="submit">审核</div>
					</div>
				</div>
			</div>
		</div>
		<script src="../../../js/mui.min.js"></script>
		<script type="text/javascript" src="../../../js/mkeyplus.base.xunjian.js"></script>
		<script type="text/javascript" src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="../../../js/common.js"></script>
		<script type="text/javascript" src="../../../js/uuid.js"></script>
		<script src="./../js/mui.previewimage.js"></script>
		<script src="./../js/mui.zoom.js"></script>
		<script type="text/javascript" src="./../js/img-up.js"></script>
		<script type="text/javascript">
			mui.init()
			mui.previewImage();
			
			window.vm = new Vue({
				el: "#container",
				data: {
					basemsg:''
				},
				methods:{}
			})
			var item;
			//遮罩初始化
			var checkValue = '';
			var _id = '';
			var type = '';
			
			mui.plusReady(function() {
				var self = plus.webview.currentWebview();
				_id = self._id;
				type = self.Type;
				var from = self.from;
				console.log('from='+from);
				item = self.item;
				
				var opener = self.opener();
				getBaseMsg();
				
				getSubmit();
				
				//选择审核意见
				$(':radio').click(function() {
					checkValue = $(this).val();
					if (checkValue == 'no') {
						$('.hsyy').css('display', 'block');
					} else {
						$('.hsyy').css('display', 'none');
					}
				});
				//			alert(_id);
//				var btn_state = self.btn_state;
					
				if(type=="2"){
					$('.mui-title').text('特殊巡检');
					special();
				}else{
					ajaxFunwei();
				}
				
				function special(){
					plus.nativeUI.showWaiting('列表加载中...');
					mui.baseApp.httpRequst('/api/v2/sbxj/findSpecialXj', {
							specialXjId: _id
						},
						function(data) {
							plus.nativeUI.closeWaiting();
							console.log("巡检项" + JSON.stringify(data));
							if(data.status == 200) {
								console.log("请求成功");
								var data = data.data;
								console.log("特殊巡检" + JSON.stringify(data))
									var str = "";
									str += '<div class="mui-card"data-id="' + data.specialXj.id + '">';
									str +='<div class="mui-card-content">'
									str +='<p>备注：<span class="beizhu">' + data.specialXj.remark + '</span></p>'
									str +='<div class="mui-row">'
									if(data.attachList == null){
									
									}else{
										var imgSrc=data.attachList;
										for(i=0;i<imgSrc.length;i++){
											str += '<div class="img-up mui-pull-left"><img src="' +Config.upurl+ imgSrc[i].attach + '" alt="" data-preview-src=""data-preview-group="1"/></div>';
//											<div class="photo mui-pull-left"data-id=""><img src="../../img/camera@3x.png"/><span class="mui-icon mui-icon-closeempty delete_"></span></div>
										}
										
									}
									str += '</div>';
									str += '</div>';
									str += '</div>';
									$(".xj-content").append(str);
								style_();

							} else if(data.data == 400) {
								mui.toast('密码不正确!');
							} else if(data.data == 409) {
								mui.toast('用户不存在!');
							}

						});
				}
				function ajaxFunwei() {
					plus.nativeUI.showWaiting('列表加载中...');
					mui.baseApp.httpRequst('/api/v2/sbxj/previewXjInfo', {
							id: _id
						},
						function(data) {
							plus.nativeUI.closeWaiting();
							console.log("巡检项" + JSON.stringify(data));
							if(data.status == 200) {
								console.log("请求成功");
								var data = data.data.jcxList;
								console.log("巡检预览" + JSON.stringify(data))
								for(var i = 0; i < data.length; i++) {
									var str = "";
									str += '<div class="mui-card"data-id="' + data[i].jcx_id + '">';
									if(data[i].status == "异常") {
										str += '<div class="mui-card-header"><div class="mui-left title fz15">'  + data[i].name + '</div><div class="mui-right mui-right-title">状态：<span class="FtHs">' + data[i].status + '</span></div></div>';
									} else {
										str += '<div class="mui-card-header"><div class="mui-left title fz15">' + data[i].name + '</div><div class="mui-right mui-right-title">状态：<span>' + data[i].status + '</span></div></div>';
									}
//									alert(data[i].image);
									if(data[i].image == null){
//										alert('111');
									str += '<div class="mui-card-content"><p class="fz13">备注：<span class="beizhu ">' + data[i].desc + '</span></p><div class="img-up hide"><img src="' +Config.upurl+ data[i].image + '" alt="" /></div></div>';
									}else{
//										alert('2222');
										str += '<div class="mui-card-content"><p class="fz13">备注：<span class="beizhu ">' + data[i].desc + '</span></p><div class="img-up"><img src="' +Config.upurl+ data[i].image + '" alt="" data-preview-src=""data-preview-group="'+(i+1)+'"/></div></div>';
									}
									str += '</div>';
									$(".xj-content").append(str);
								};
								$('.hiden').css('display','block')
								alert();
								style_();
								console.log('from='+from);
								if(from == 'dsh'){
									$('.ifsubmit').css('display','block');
								} 
								if(from == 'yxj'){
									$('.shmsg').css('display','block');
								} 

							} else if(data.data == 400) {
								mui.toast('密码不正确!');
							} else if(data.data == 409) {
								mui.toast('用户不存在!');
							}

						});
						
				}
			})
			
			function getBaseMsg(){
				mui.baseApp.httpRequst('/api/v2/sbxj/userXjInfo', {
						userXjId:_id
					},
					function(res) {
						console.log('xx..'+JSON.stringify(res));
						vm.basemsg = res.data;
					},
					function(err) {}
				)
			}
			
			function getSubmit(){
				//提交审核
				document.querySelector('#submit').addEventListener('tap', function() {
					var reason = document.querySelector('.zdytt').value;
					if(checkValue == ''){
						mui.toast('请选择审核意见');
						return;
					}
					if (checkValue == 'no' && reason == '') {
						mui.toast('请输入拒绝原因');
						return;
					}
					var review_status = checkValue == 'no' ? '2' : '1';
					reason = checkValue == 'yes' ? '' : reason;
					plus.nativeUI.showWaiting('提交中...');
					mui.baseApp.httpRequst('/api/v2/sbxj/reviewXjTask', { 
							type:item.type,
							datumId:item.id,
							memberId: localStorage.getItem('userid'),
							reviewStatus: review_status,
							rejectReason: reason
						},
						function(res) {
							console.log('...'+JSON.stringify(res));
							var status = res.status
							if (status == 200) {
								var opener = plus.webview.currentWebview().opener();
								mui.fire(opener, 'refresh');
								// mui.toast('审核通过！');
								setTimeout(()=>{
									plus.nativeUI.closeWaiting();
									plus.webview.currentWebview().close();
								},1500)
							}else{
								mui.toast(res.message)
							}
						},
						function(err) {
							mui.toast('审核失败！')
						}
					)
				})
			}
			function alert(){
				$(".mui-card-header").on("tap", ".title", function() {
					var Text = $(this).text()
					mui.alert(Text, '巡检项名称', function() {});
				})
			}
			
			//			判断图片和备注改变样式
			function style_(){			
			var contentlist=$('.mui-card-content');
				for(var i=0;i<contentlist.length;i++){
//					var img_src=$(contentlist[i]).find('img').attr('src');
					
					var beizhu=$(contentlist[i]).find('.beizhu').text();
					/*alert(img_src);
					if(img_src==""){
						$(contentlist[i]).find('.img-up').addClass('hide');
						alert(beizhu);
					}*/
					if(beizhu==""){
						var beizhu=$(contentlist[i]).find('.beizhu').text('暂无备注');
					}
				}
			}
		</script>
	</body>

</html>